import React from 'react'
import { Select, Button } from 'antd';
// import ReactDOM from 'react-dom';
// import { Route, Switch, HashRouter as Router } from 'react-router-dom';
import 'antd/dist/antd.css';
import { Table } from 'antd';
// import index from '../router/index'
// import test from './test'

const { Option } = Select;



const data = [
    {
        key: '1',
        name: 'Book 1',
        bookname: "Java Sprict",
        factory: '中教云出版社',
        subject: '前端',
        fields: '基础',
        versions: '第四版',
        number: 1,

    },
    {
        key: '2',
        name: 'Book 2',
        bookname: "React",
        factory: '中教云智出版社',
        subject: '前端',
        fields: '框架',
        versions: '第四版',
        number: 500,

    },
    {
        key: '3',
        name: 'Book 3',
        bookname: "Vue",
        factory: '中教云智出版社',
        subject: '前端',
        fields: '框架',
        versions: '第四版',
        number: 100,

    },
    {
        key: '4',
        name: 'Book 4',
        bookname: "Java基础",
        factory: '中教云出版社',
        subject: 'java',
        fields: '基础',
        versions: '第二版',
        number: 130,

    },
    {
        key: '5',
        name: 'Book 5',
        bookname: "spring boot",
        factory: '中教云出版社',
        subject: 'java',
        fields: '框架',
        versions: '第三版',
        number: 88,

    },
    {
        key: '6',
        name: 'Book 6',
        bookname: "C++入门",
        factory: '中教云迪出版社',
        subject: 'C++',
        fields: '基础',
        versions: '第三版',
        number: 19,

    },
    {
        key: '7',
        name: 'Book 7',
        bookname: "Python基础",
        factory: '中教云智出版社',
        subject: 'python',
        fields: '基础',
        versions: '第四版',
        number: 100,

    },
];
// const { Content, Sider } = Layout;
function Login(props) {

    const columns = [
        {
            title: 'id',
            dataIndex: 'name',
            key: 'name',
            // render: text => <a>{text}</a>,
        },
        {
            title: '书名',
            dataIndex: 'bookname',
            key: 'bookname',
        },
        {
            title: '厂商',
            dataIndex: 'factory',
            key: 'factory',
        },
        {
            title: '学科',
            key: 'subject',
            dataIndex: 'subject',
        },
        {
            title: '学段',
            key: 'fields',
            dataIndex: 'fields',
        },
        {
            title: '版本',
            key: 'versions',
            dataIndex: 'versions',
        },
        {
            title: '资源数量',
            key: 'number',
            dataIndex: 'number',
        },
        {

            title: '操作',
            key: 'action',
            render: (text, record) => (
                <Button onClick={() => handleClick(text)} size="middle">
                    对照
                </Button>
            ),
        },
    ];


    const handleClick = (item) => {
        props.history.push(`/`);

    }



    function handleChange(value) {
        console.log(`selected ${value}`);
    }
    return (

        <>
            <Select defaultValue="资源厂商" style={{ width: 120 }} onChange={handleChange}>
                <Option value="中教云">中教云</Option>
                <Option value="中教云智">中教云智</Option>
                <Option value="中教云迪" >
                    中教云迪
                </Option>
                <Option value="中教云科技">中教云科技</Option>
            </Select>
            <Select defaultValue="学科" style={{ width: 120 }} >
                <Option value="前端">前端</Option>
                <Option value="Java">Java</Option>
                <Option value="C++">C++</Option>
                <Option value="python">python</Option>
                <Option value="UI">UI</Option>UI
                </Select>
            <Select defaultValue="学段" style={{ width: 120 }} >
                <Option value="基础">基础</Option>
                <Option value="框架">框架</Option>
                <Option value="算法">框架</Option>
                {/* <Option value="lucy">Lucy</Option> */}
            </Select>
            <Select defaultValue="版本" style={{ width: 120 }}>
                <Option value="第一版">第一版</Option>
                <Option value="第二版">第二版</Option>
                <Option value="第三版">第三版</Option>
                <Option value="第四版">第四版</Option>

            </Select>
            <br />
            <br />
            <br />
            <Table columns={columns} dataSource={data} />

        </>
        // ReactDOM.render(<Table columns={columns} dataSource={data} />, document.getElementById("root")),
    )
}
export default Login
// ReactDOM.render(<Select />, document.getElementById("root"));
// ReactDOM.render(<Table columns={columns} dataSource={data} />, document.getElementById("root"));